<!--
 * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @Date: 2024-03-13 14:50:45
 * @LastEditors: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @LastEditTime: 2024-03-19 09:32:56
 * @FilePath: \dm\云课堂\index.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>云课堂</title>
        <link rel="icon" href="https://course.myhope365.com/favicon.ico">
        <link rel="stylesheet" href="./lib/swiper/swiper-bundle.min.css">
        <link rel="stylesheet" href="./lib/Bootstrap/css/bootstrap.min.css">
        <script src="./lib/jquery/jquery-3.4.1.min.js"></script>
        <script src="./lib/swiper/swiper-bundle.min.js"></script>
        <script src="./lib/Bootstrap/js/bootstrap.min.js"></script>
        <script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>
        <script src="./js/index.js"></script>
        <link rel="stylesheet" href="./css/index.css">
    </head>
    <body>
        <div class="box">
            <!-- 顶部区域 -->
            <header>
                <!-- 顶部标题区域 -->
                <div class="top">
                    <!-- 天亮logo -->
                    <div class="logo">
                        <img src="https://course.myhope365.com/img/logo-text.321d0dc2.png" alt="">
                    </div>
                    <!-- 导航栏与搜索框 登录 -->
                    <div class="top_list">
                        <!-- 导航栏 -->
                        <nav class="col-6">
                            <ul>
                                <li><a href="#">首页</a></li>
                                <li class="none">
                                    <a class="pullDown" id="pullDown" href="#">课程分类<img src="./images/向下箭头.png" alt=""></a>
                                    <!-- 课程分类的下拉列表 -->
                                    <ul class="pull-down">
                                        <!-- <li><a href="#">宇哥带你学Java</a></li>
                                        <li><a href="#">学长面对面</a></li>
                                        <li><a href="#">职业素养必修课</a></li>
                                        <li><a href="#">大数据</a></li>
                                        <li><a href="#">WEB前端</a></li>
                                        <li><a href="#">数据库</a></li>
                                        <li><a href="#">网络爬虫</a></li>
                                        <li><a href="#">求职技巧</a></li>
                                        <li><a href="#">项目实战</a></li>
                                        <li><a href="#">公共常用开发技术</a></li>
                                        <li><a href="#">经典笔试面试题</a></li>
                                        <li><a href="#">JavaSe核心基础</a></li> -->
                                    </ul>
                                </li>
                                <li><a href="#">教学管理云平台</a></li>
                            </ul>
                        </nav>
                        <!-- 搜索框 -->
                        <div class="search col-3">
                            <input class="searchInput" type="text" placeholder="搜索课程~">
                            <button class="search btnGo">
                                <img src="" alt="">
                            </button>
                        </div>
                        <!-- 购物车 登录 -->
                        <div class="car_in">
                            <!-- 购物车 -->
                            <div class="car">
                                <img src="" alt="">
                            </div>
                            <!-- 登录按钮 -->
                            <div class="in" id="userIn">
                                    <div class="tips">开通VIP免费观看全站视频</div>
                                    <button class="glyphicon glyphicon-user" data-toggle="modal" data-target="#register"><b>登录/注册</b></button> 
                                <div class="inDown">
                                    <ul>
                                        <li>个人中心</li>
                                        <li>我的课程</li>
                                        <li>我的订单</li>
                                        <li class="out">退出登录</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 轮播图标题区域 -->
                <div class="swiper">
                    <div class="swiper-wrapper"></div>
                    <!-- 如果需要分页器 -->
                    <div class="swiper-pagination"></div>
                    
                    <!-- 如果需要导航按钮 -->
                    <div class="swiper-button-prev swBut_prev bt">
                        <img src="" alt="">
                    </div>
                    <div class="swiper-button-next swBut_next bt">
                        <img src="" alt="">
                    </div>
                </div>
                 <!-- 仅需198即可观看所有付费课程 -->
                 <div class="money">
                    <div class="center">
                        <img src="" alt="">
                        <span>仅需198即可观看所有付费课程</span>
                        <button>开通VIP</button>
                    </div>
                </div>
            </header>
            <!-- 主体内容区域 -->
            <section>
                <!-- 直播课程  课程榜单 -->
                <div class="broadcast">
                    <!-- 直播课程 -->
                    <div class="broadcast_1">
                        <!-- 标题 -->
                        <div class="br_title">
                            <div class="img">
                                <img src="" alt="">
                            </div>
                            <div class="title">
                                <h2>直播课程</h2>
                            </div>
                            <p>互联网大佬在线直播</p>
                            <div class="tow_img">
                                <img src="" alt="">
                                <img src="" alt="">
                            </div>
                        </div>
                        <!-- 课程内容 -->
                        <div class="content">
                            <div class="content_top">
                                <div class="course">
                                    <div class="course_img">
                                        <img src="https://online-course.nos-eastchina1.126.net/1-1352930580794179584.png" alt="">
                                    </div>
                                    <div class="text"><b>求职技巧之重难点问题剖析与解决</b> </div>
                                    <p><img src="images/圆形选中.png" alt=""> 直播结束 </p>
                                </div>
                                <div class="course">
                                    <div class="course_img">
                                        <img src="https://online-course.nos-eastchina1.126.net/%E7%9B%B4%E6%92%AD%E5%B0%81%E9%9D%A2-1254953535796150272.png" alt="">
                                    </div>
                                    <div class="text"><b>求职技巧之重难点问题剖析与解决</b> </div>
                                    <p><img src="images/圆形选中.png" alt=""> 直播结束 </p>
                                </div>
                            </div>
                            <div class="bottom">
                                <div class="course">
                                    <div class="course_img">
                                        <img src="https://online-course.nos-eastchina1.126.net/123-1252130152859566080.png" alt="">
                                    </div>
                                    <div class="text"><b>求职技巧之重难点问题剖析与解决</b> </div>
                                    <p><img src="images/圆形选中.png" alt=""> 直播结束 </p>
                                </div>
                                <div class="course">
                                    <div class="course_img">
                                        <img src="https://online-course.nos-eastchina1.126.net/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E4%B8%8E%E7%AE%97%E6%B3%95%20%E5%9F%BA%E7%A1%80%E7%AF%87%20%E6%8B%B7%E8%B4%9D-1252123020651134976.jpg" alt="">
                                    </div>
                                    <div class="text"><b>求职技巧之重难点问题剖析与解决</b> </div>
                                    <p><img src="images/圆形选中.png" alt=""> 直播结束 </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 课程榜单 -->
                    <div class="broadcast_2">
                        <!-- 标题 -->
                        <div class="br_title">
                            <div class="img">
                                <img src="" alt="">
                            </div>
                            <div class="title">
                                <h2>课程榜单</h2>
                            </div>
                            <p>以购买、学习相关数据为依据～每日更新</p>
                        </div>
                        <!-- 榜单 -->
                        <div class="list">
                            <!-- 畅销榜图片 -->
                            <div class="list_img">
                                <img src="https://course.myhope365.com/img/bestseller-list.23c00d98.png" alt="">
                            </div>
                            <!-- 畅销榜内容 -->
                            <div class="cx">
                                <div class="cx_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/%E6%B1%82%E8%81%8C%E6%88%90%E5%8A%9F%E4%B9%8B%E9%81%93%E4%B8%8E%E6%9C%AF_1-1227885610962780160.jpg" alt="">
                                </div>
                                <div class="text">
                                    <p>求职成功之道与术</p>
                                    <p class="eight">￥800</p>
                                    <p>638 人报名</p>
                                </div>
                            </div>
                            <div class="cx">
                                <div class="cx_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1_%E5%AE%A3%E4%BC%A0%E5%9B%BE-1206867183058026496.png" alt="">
                                </div>
                                <div class="text">
                                    <p> 毕设从小白到老司机修成记 </p>
                                    <p class="eight">￥1000</p>
                                    <p>616 人报名</p>
                                </div>
                            </div>
                            <div class="cx">
                                <div class="cx_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/hadoopcore%E4%BB%8E%E5%85%A5%E9%97%A8%E5%88%B0%E5%AE%9E%E6%88%98-1257989668687839232.jpg" alt="">
                                </div>
                                <div class="text">
                                    <p> hadoopcore从入门到实战 </p>
                                    <p class="eight">￥99.9</p>
                                    <p>125 人报名</p>
                                </div>
                            </div>
                            <button>换一换</button>
                        </div>
                    </div>
                </div>
                <!-- 免费课程 -->
                <div class="free">
                    <!-- 标题 -->
                    <div class="free_title">
                        <div class="free_img">
                            <img src="" alt="">
                        </div>
                        <h2>免费课程</h2>
                        <div class="more">
                            <a href="#">更多</a>
                            <img src="images/309下一页、前进、查看更多-线性圆框.png" alt="">
                        </div>
                    </div>
                    <!-- 免费内容 -->
                    <div class="free_content">
                    </div>
                </div>
                <!-- 精品课程 -->
                <div class="premium">
                    <!-- 标题 -->
                    <div class="premium_title">
                        <div class="premium_img">
                            <img src="https://course.myhope365.com/img/boutique-icon.6d982741.png" alt="">
                        </div>
                        <h2>精品课程</h2>
                        <div class="vip_img">
                            <img src="https://course.myhope365.com/img/vip-free.aa229615.png" alt="">
                        </div>
                        <div class="more">
                            <a href="#">更多</a>
                            <img src="images/309下一页、前进、查看更多-线性圆框.png" alt="">
                        </div>
                    </div>
                    <!-- 精品内容 -->
                    <div class="premium_content">
                    </div>
                </div>
                <!-- 限时折扣课程 -->
                <div class="discount">
                    <!-- 标题 -->
                    <div class="discount_title">
                        <div class="discount_img">
                            <img src="https://course.myhope365.com/img/time-limit-icon.12673615.png" alt="">
                        </div>
                        <h2>限时折扣课程</h2>
                        <div class="vip_img">
                            <img src="https://course.myhope365.com/img/vip-free.aa229615.png" alt="">
                        </div>
                        <div class="more">
                            <a href="#">更多</a>
                            <img src="images/309下一页、前进、查看更多-线性圆框.png" alt="">
                        </div>
                    </div>
                    <!-- 限时折扣课程内容 -->
                        <div class="discount_content">
                            <!-- <div class="discount_text">
                            <div class="discount_div">
                                <div class="discount_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/1%E5%A4%87%E4%BB%BD%2014-1630366194873663488.png" alt="">
                                </div>
                                <div class="text">
                                    <p><b>Java基础-v2022版</b></p>
                                    <p class="discount_pp">共 65 节课 | 87 人报名</p>
                                    <p class="discount_p"><b>免费</b></p>
                                </div>
                            </div>
                        </div>
                        <div class="discount_text">
                            <div class="discount_div">
                                <div class="discount_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/1%E5%A4%87%E4%BB%BD%2014-1630366194873663488.png" alt="">
                                </div>
                                <div class="text">
                                    <p><b>Java基础-v2022版</b></p>
                                    <p class="discount_pp">共 65 节课 | 87 人报名</p>
                                    <p class="discount_p"><b>免费</b></p>
                                </div>
                            </div>
                        </div>
                        <div class="discount_text">
                            <div class="discount_div">
                                <div class="discount_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/1%E5%A4%87%E4%BB%BD%2014-1630366194873663488.png" alt="">
                                </div>
                                <div class="text">
                                    <p><b>Java基础-v2022版</b></p>
                                    <p class="discount_pp">共 65 节课 | 87 人报名</p>
                                    <p class="discount_p"><b>免费</b></p>
                                </div>
                            </div>
                        </div>
                        <div class="discount_text">
                            <div class="discount_div">
                                <div class="discount_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/1%E5%A4%87%E4%BB%BD%2014-1630366194873663488.png" alt="">
                                </div>
                                <div class="text">
                                    <p><b>Java基础-v2022版</b></p>
                                    <p class="discount_pp">共 65 节课 | 87 人报名</p>
                                    <p class="discount_p"><b>免费</b></p>
                                </div>
                            </div>
                        </div>
                        <div class="discount_text">
                            <div class="discount_div">
                                <div class="discount_img">
                                    <img src="https://online-course.nos-eastchina1.126.net/1%E5%A4%87%E4%BB%BD%2014-1630366194873663488.png" alt="">
                                </div>
                                <div class="text">
                                    <p><b>Java基础-v2022版</b></p>
                                    <p class="discount_pp">共 65 节课 | 87 人报名</p>
                                    <p class="discount_p"><b>免费</b></p>
                                </div> -->
                            <!-- </div> -->
                        </div>
                    </div>
                </div>
                <!-- 头条精选 -->
                <div class="front_page">
                    <!-- 标题 -->
                    <div class="front_title">
                        <div class="front_img">
                            <img src="" alt="">
                        </div>
                        <h2>头条精选</h2>
                        <div class="more">
                            <a href="#">更多</a>
                            <img src="images/309下一页、前进、查看更多-线性圆框.png" alt="">
                        </div>
                    </div>
                    <!-- 头条精选内容 -->
                    <div class="front_content">
                        <div class="front_text">
                        <div class="front_div">
                            <div class="front_img">
                                <img src="https://online-course.nos-eastchina1.126.net/IMG_20240131_134058-1754304501860270080.jpg" alt="">
                            </div>
                            <div class="text">
                                <p><b> 不忘初心 聚焦突破|2023-2024年度天亮生态圈年会成功举办 </b></p>
                            </div>
                        </div>
                    </div>
                    <div class="front_text">
                        <div class="front_div">
                            <div class="front_img">
                                <img src="https://online-course.nos-eastchina1.126.net/%E6%89%93%E5%8D%A1%E5%AD%A6%E4%B9%A0%E5%9B%BE%E7%89%87-1742024955668725760.jpg" alt="">
                            </div>
                            <div class="text">
                                <p><b> 打卡学习  让学习成为一种习惯 </b></p>
                            </div>
                        </div>
                    </div>
                    <div class="front_text">
                        <div class="front_div">
                            <div class="front_img">
                                <img src="https://online-course.nos-eastchina1.126.net/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20231222142220-1742024914673598464.jpg" alt="">
                            </div>
                            <div class="text">
                                <p><b> 未来已来  天亮带你一起探索物联网  共创万物智联 </b></p>
                            </div>
                        </div>
                    </div>
                    <div class="front_text">
                        <div class="front_div">
                            <div class="front_img">
                                <img src="https://online-course.nos-eastchina1.126.net/%E6%96%87%E7%AB%A0%E5%B0%81%E9%9D%A2-1742007073333313536.jpg" alt="">
                            </div>
                            <div class="text">
                                <p><b> 校企携手 双向赋能|天亮生态圈为学生打开未来之门 </b></p>
                            </div>
                        </div>
                    </div>
                    <div class="front_text">
                        <div class="front_div">
                            <div class="front_img">
                                <img src="https://online-course.nos-eastchina1.126.net/640-1727887578247462912.jpg" alt="">
                            </div>
                            <div class="text">
                                <p><b> 河北科技大学信息科技与工程学院党委副书记赵新伟老师一行到访天亮生态圈莅临指导工作 </b></p>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
            </section>
            <!-- 测导航 -->
            <aside>
                <div class="customerService_1">
                    <p class="a1p">客服1</p>
                </div>
                <div class="customerService_2">
                    <p class="a2p">客服2</p>
                    <div class="alert1">
                        <p class="a1p1">联系客服</p>
                        <div class="a1p2">
                            <img src="./images/电话.png" alt="">
                            <span class="a1span">13812345678</span>
                        </div>
                    </div>
                    <div class="sanjiao1"></div>
                </div>
                <div class="customerService_3">
                    <p class="a3p">技术支持</p>
                    <div class="alert2">
                        <p class="a1p1">技术支持</p>
                        <div class="a1p2">
                            <img src="./images/电话.png" alt="">
                            <span class="a1span">13812345678</span>
                        </div>
                    </div>
                    <div class="sanjiao2"></div>
                </div>
            </aside>
            <!-- 底部 -->
            <footer>
                <div class="ftbox">
                    <div class="ft1">友情链接:</div>
                    <div class="ft2">
                        <ul>
                            <li><a href="#">天亮教育</a></li>
                            <li><a href="#">星云大数据平台</a></li>
                            <li><a href="#">教学管理平台</a></li>
                            <li><a href="#">尚云科技</a></li>
                            <li><a href="#">天亮公开课资源</a></li>
                        </ul>
                    </div>
                    <div class="ft3"></div>
                    <p>Copyright © 2017-2025 石家庄天亮教育科技有限公司 备案号:冀ICP备17020003号</p>
                </div>
            </footer>
        </div>
        <!-- 吸顶 -->
        <div class="box_ceiling">
            <div class="ceiling_top">
                <!-- 天亮logo -->
                <div class="ceiling_logo">
                    <img src="https://course.myhope365.com/img/logo-text-green.2137bfaa.png" alt="">
                </div>
                <!-- 导航栏与搜索框 登录 -->
                <div class="ceiling_top_list">
                    <!-- 导航栏 -->
                    <nav class="col-5">
                        <ul>
                            <li><a href="#">首页</a></li>
                            <li class="none">
                                <a class="pullDown" id="pullDown" href="#">课程分类<img src="./images/向下箭头_黑.png" alt=""></a>
                                <!-- 课程分类的下拉列表 -->
                                <ul class="pull-down" style="display: none;">
                                </ul>
                            </li>
                            <li><a href="#">教学管理云平台</a></li>
                        </ul>
                    </nav>
                    <!-- 搜索框 -->
                    <div class="search col-3">
                        <input class="searchInput" type="text" placeholder="搜索课程~">
                        <button class="search  btnGo">
                            <img src="" alt="">
                        </button>
                    </div>
                    <!-- 购物车 登录 -->
                    <div class="ceiling_car_in">
                        <!-- 购物车 -->
                        <div class="car">
                            <img src="" alt="">
                        </div>
                        <!-- 登录按钮 -->
                        <div class="goin" id="userIn">
                            <button class="glyphicon glyphicon-user" data-toggle="modal" data-target="#register"><b>登录/注册</b></button> 
                            <div class="topDown" style="display: none;">
                                <ul>
                                    <li>个人中心</li>
                                    <li>我的课程</li>
                                    <li>我的订单</li>
                                    <li class="out">退出登录</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 登录、注册 -->
        <div id="register" class="modal fade" tabindex="-1">
            <div class="modal-dialog">
                <div class="modal-content" style="padding: 20px 36px 24px;width: 360px;height: 332px;">
                    <div class="modal-body">
                        <button class="close" data-dismiss="modal">
                            <span>&times;</span>
                        </button>
                    </div>
                    <div class="userIn">
                        <div class="user color_text">普通登录</div>
                        <div class="pow">手机登录</div>
                    </div>
                    <div class="modal-body module_body">
                        <form class="form-group" id="form-group" action="">
                            <div class="form-group input_user">
                                <img src="./images/用户名.png" alt="">
                                <input class="form-control" id="user" type="text" placeholder="请输入账户名">
                            </div>
                            <div class="form-group input_pow">
                                <img src="./images/密码.png" alt="">
                                <input class="form-control" id="pow" type="password" placeholder="请输入密码">
                            </div>
                            <div class="text-right">
                                <button class="form-control btnIn btn-primary" id="btnIn" type="button" style="color: #fff; background-color: #00CF8C; margin-top: 25px; margin-bottom: 20px;">登录</button>
                            </div>
                            <a href="" class="register href_a">立刻注册！</a>
                            <a href="" class="forgot href_a">忘记密码？</a>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>